<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">
<h:head>

	<style type="text/css">
.ui-layout-north {
	z-index: 20 !important;
	overflow: visible;
}

.ui-layout-north .ui-layout-unit-content {
	overflow: visible;
}

.ui-widget {
	font-size: 9px !important;
}

.centro {
	top: 50%
}

.tabela {
	width: 700px;
}

.size {
	width: 700px;
	position: absolute;
	left: 20%;
	top: 10%;
}
</style>

	<script type="text/javascript">
		PrimeFaces.locales['pt'] = {
			closeText : 'Fechar',
			prevText : 'Anterior',
			nextText : 'Próximo',
			currentText : 'Começo',
			monthNames : [ 'Janeiro', 'Fevereiro', 'Março', 'Abril', 'Maio',
					'Junho', 'Julho', 'Agosto', 'Setembro', 'Outubro',
					'Novembro', 'Dezembro' ],
			monthNamesShort : [ 'Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun',
					'Jul', 'Ago', 'Set', 'Out', 'Nov', 'Dez' ],
			dayNames : [ 'Domingo', 'Segunda', 'Terça', 'Quarta', 'Quinta',
					'Sexta', 'Sábado' ],
			dayNamesShort : [ 'Dom', 'Seg', 'Ter', 'Qua', 'Qui', 'Sex', 'Sáb' ],
			dayNamesMin : [ 'D', 'S', 'T', 'Q', 'Q', 'S', 'S' ],
			weekHeader : 'Semana',
			firstDay : 0,
			isRTL : false,
			showMonthAfterYear : false,
			yearSuffix : '',
			timeOnlyTitle : 'Só Horas',
			timeText : 'Tempo',
			hourText : 'Hora',
			minuteText : 'Minuto',
			secondText : 'Segundo',
			ampm : false,
			month : 'Mês',
			week : 'Semana',
			day : 'Dia',
			allDayText : 'Todo o Dia'
		};
	</script>

	<title>Cadastro de Assinatura</title>
</h:head>

<h:body>

	<ui:decorate template="/templateBase.xhtml">
		<ui:define name="center">
			<p:growl id="growl" life="3000" />
			<h:form id="formCadAssinatura" acceptcharset="ISO-8859-1" lang="pt">
				<br />
				<br />
				<br />
				<p:panel styleClass="size" header="Cadastro de Assinatura"
					footer="Integração - Portal de Serviços e Comunicação">
					<p:tabView>
						<p:tab title="Principal">
							<br />

							<h:panelGrid columns="2" cellpadding="10">

								<h:panelGrid columns="3">
									<p:inputText size="10" value="#{assinaturaBacking.aSalvar.id}"
										readonly="true" />
									<p:inputText size="50"
										value="#{assinaturaBacking.aSalvar.nome}" />
									<p:commandButton icon="ui-icon-search"
										oncomplete="dlgPesquisaAssinatura.show()"
										update=":formPesquisaAssinatura" />

								</h:panelGrid>


								<h:panelGrid>
							Pré - Visualização
							<br />
									<ui:repeat value="#{assinaturaBacking.imagem}" var="image">
										<p:graphicImage value="/images/assinatura/#{image}"
											width="150" height="80" />
									</ui:repeat>

								</h:panelGrid>

							</h:panelGrid>

							<br />

							<p:fileUpload
								fileUploadListener="#{assinaturaBacking.enviarImagem}"
								label="Selecionar" invalidFileMessage="Formato inválido"
								update=":formCadAssinatura" process="@all" showButtons="false"
								allowTypes="/(\.|\/)(jpe?g|png|gif)$/" />
							<br />
							<p:separator />
							<br />
							<div align="center">
								<h:panelGrid columns="2">
									<p:commandButton value="Salvar"
										actionListener="#{assinaturaBacking.salvarAssinatura}"
										ajax="false" update=":formPesquisaAssinatura" />

									<p:commandButton value="Limpar"
										actionListener="#{assinaturaBacking.limpaTela}" ajax="false"
										update="formCadAssinatura" />
								</h:panelGrid>
							</div>
						</p:tab>
					</p:tabView>
				</p:panel>
			</h:form>

			<p:dialog header="Pesquisa Assinatura"
				widgetVar="dlgPesquisaAssinatura" showEffect="clip"
				hideEffect="clip" closable="true"
				footer="Integração - Portal de Serviços e Comunicação" width="450"
				height="250">
				<h:form id="formPesquisaAssinatura" prependId="false"
					acceptcharset="ISO-8859-1" lang="pt">

					<p:dataTable value="#{assinaturaBacking.listaAssinatura}" var="a"
						rows="10" paginator="true"
						emptyMessage="Nenhuma assinatura encontrada na base de dados!">

						<p:column headerText="Nome">
							<h:outputText value="#{a.nome}" />
						</p:column>

						<p:column>
							<div align="center">
								<p:commandButton icon="ui-icon-check"
									actionListener="#{assinaturaBacking.selecionaAssinatura(a)}"
									update=":formCadAssinatura"
									oncomplete="dlgPesquisaAssinatura.hide()" />
							</div>
						</p:column>

					</p:dataTable>
				</h:form>
			</p:dialog>

		</ui:define>
	</ui:decorate>
</h:body>
</html>